<!--
  Generated template for the MyCouponsPage page.

  See http://ionicframework.com/docs/components/#navigation for more info on
  Ionic pages and navigation.
-->
<ion-header>

  <ion-navbar>
    <ion-title>选择优惠券</ion-title>
  </ion-navbar>

</ion-header>


<ion-content>
  <ul class="coupon-list">
    <li class="coupon-item" *ngFor="let data of Coupons">
      <div *ngIf="Coupons!=''||Coupons!=null" (click)='select(data)' [ngClass]="{true: 'container2', false: 'container'}[data.ma_coupon.coupon_id === coupon.ma_coupon.coupon_id]">
        <div class="half-left">
          <div class=" goods">{{data.ma_coupon.coupon_name}}x{{data.surplus_num}}</div>
          <div class=" range">所有充电桩可用</div>
          <div class=" expiry-date">有效期：{{data.ma_coupon.expiry_date | date:"yyyy/MM/dd"}}</div>
        </div>
        <div class="half-right">
          <span>￥</span>
          <span class="fare">{{data.ma_coupon.denomination}}</span>
          <!--<span class="fare">{{data.denomination | number: '3.0-0'}}</span>-->
          <!-- <span class="fare">{{data.denomination}}</span> -->
        </div>
      </div>
    </li>

    <li class="coupon-item" *ngIf="Coupons==''||Coupons==null">
      <div class="font-coupon">您没有优惠券</div>
    </li>

    <!-- <li class="coupon-item">
      <div class="container">
        <div class="half-left">
          <div class=" goods">新人红包</div>
          <div class=" range">所有充电桩可用</div>
          <div class=" expiry-date">有效期至：2017-05-01</div>
        </div>
        <div class="half-right">
          <span>￥</span>
          <span class="fare">3</span>
        </div>
      </div>
    </li> -->
    <!--
    <li class="coupon-item">
      <div class="container">
        <div class="half-left">
          <div class=" goods">新人红包</div>
          <div class=" range">所有充电桩可用</div>
          <div class=" expiry-date">有效期至：2017-05-01</div>
        </div>
        <div class="half-right">
          <span>￥</span>
          <span class="fare">3</span>
        </div>
      </div>
    </li>

    <li class="coupon-item">
      <div class="container">
        <div class="half-left">
          <div class=" goods">新人红包</div>
          <div class=" range">所有充电桩可用</div>
          <div class=" expiry-date">有效期至：2017-05-01</div>
        </div>
        <div class="half-right">
          <span>￥</span>
          <span class="fare">3</span>
        </div>
      </div>
    </li> -->
  </ul>
  <div class="T-buttons">
    <button ion-button class="cancle" (click)="noClick()">取消</button>
    <button ion-button class="confirm" (click)="okClick()">确认</button>
  </div>
</ion-content>